﻿<phone:PhoneApplicationPage 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:custom="clr-namespace:WPtrakt.Custom"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:controlsPrimitives="clr-namespace:Microsoft.Phone.Controls.Primitives;assembly=Microsoft.Phone.Controls" 
    xmlns:sys="clr-namespace:System;assembly=mscorlib"
    xmlns:lazy="clr-namespace:LazyListBox"
    x:Class="WPtrakt.Main"
    SupportedOrientations="PortraitOrLandscape"  Orientation="Portrait"  
    shell:SystemTray.IsVisible="True" Loaded="PhoneApplicationPage_Loaded" OrientationChanged="PhoneApplicationPage_OrientationChanged">

    <Grid x:Name="LayoutRoot" >
        <!-- Header-->
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition Height="7"/>

            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid x:Name="TitlePanel" Grid.Column="0" Grid.Row="0" HorizontalAlignment="Stretch">
            <Grid.RowDefinitions>
                <RowDefinition Height="50"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="50"/>
                <ColumnDefinition Width="80"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Image Grid.Row="0" Grid.Column="0" Source="/WPtrakt;component/Images/fulllogo.png" Height="40" Margin="10 0 5 0"/>
            <TextBlock Grid.Row="0" Grid.Column="1" CacheMode="BitmapCache"  Text="trakt"  FontSize="33" FontFamily="Segoe WP SemiBold"/>
            <Image Name="SearchIcon" Grid.Row="0" Grid.Column="2" Source="{Binding SearchIcon}" Tap="Search_Tap" HorizontalAlignment="Right" Height="40" Margin="10 0 5 0"/>
        </Grid>
        <Border Grid.Row="1" Margin="0 2"  Height="3" Background="{StaticResource PhoneAccentBrush}" CacheMode="BitmapCache"/>
        <!-- Header end-->
        <controls:Panorama x:Name="MainPanorama"  Margin="0,0,0,-39" SelectionChanged="MainPanorama_SelectionChanged" Grid.Row="3" Visibility="Collapsed" Opacity="0">
            <controls:PanoramaItem Margin="0 -25" Name="ProfilePanoramaItem">
                <StackPanel HorizontalAlignment="Left" Name="MainMenuStackpanel">
                    <StackPanel Margin="0,0,0,17"  Width="480" Height="90" Orientation="Horizontal" Name="AvatarPanel" HorizontalAlignment="Center">
                        <Image Width="60" Height="60" Margin="40 0 10 5" Source="{Binding UserAvatar}"/>
                        <StackPanel Margin="0,2,0,17"  Width="400" Height="90" Orientation="Vertical" HorizontalAlignment="Center">
                            <TextBlock Text="{Binding UserName}" TextWrapping="Wrap" Style="{StaticResource PhoneTextLargeStyle}" Height="40" />
                            <TextBlock Text="{Binding UserAbout}" TextWrapping="Wrap" Margin="12,0,12,0" Style="{StaticResource PhoneTextSubtleStyle}" Height="45" />
                        </StackPanel>
                    </StackPanel>

                    <ListBox   ScrollViewer.VerticalScrollBarVisibility="Disabled"  Margin="0 0 0 15" ItemsSource="{Binding WatchingNow}" Visibility="Collapsed"  Name="WatchingNow">
                        <ListBox.ItemTemplate>
                            <DataTemplate>
                                <Grid Name="WatchingNowGrid" Height="120" Width="480" >
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="110"/>
                                        <RowDefinition Height="10"/>
                                    </Grid.RowDefinitions>
                                    <Grid Grid.Row="0" Width="480" Height="Auto"  Opacity="0.9" Tap="WatchingNowGrid_Tap_1">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="160"/>
                                            <ColumnDefinition Width="320"/>
                                        </Grid.ColumnDefinitions>
                                        <custom:DelayLoadImage Grid.Column="0" Grid.Row="0" DefaultImageSource="Images/screen-small.jpg" ActualImageSource="{Binding ScreenImage}" HorizontalAlignment="Right"  Height="90"/>
                                        <StackPanel Grid.Row="0" Grid.Column="1" Orientation="Vertical" Margin="0 10" >
                                            <TextBlock Text="Watching now"  Style="{StaticResource PhoneTextSubtleStyle}"/>
                                            <TextBlock FontSize="25"   Text="{Binding Name}" Style="{StaticResource PhoneTextLargeStyle}" />
                                            <TextBlock   Text="{Binding SubItemText}" Style="{StaticResource PhoneTextSubtleStyle}" />
                                        </StackPanel>
                                        <toolkit:ContextMenuService.ContextMenu>
                                            <toolkit:ContextMenu Name="NextEpisodesContextMenu">
                                                <toolkit:MenuItem Header="Rate" Name="EpisodeRate" Click="WatchingRate_Click" />
                                                <toolkit:MenuItem Header="Check in history" Name="RecentlyWatched" Click="RecentlyWatched_Click_1" />
                                                <toolkit:MenuItem Header="Cancel check in" Name="CancelCheckinEpisode" Click="CancelCheckinEpisode_Click_1" />
                                            </toolkit:ContextMenu>
                                        </toolkit:ContextMenuService.ContextMenu>
                                    </Grid>
                                    <ProgressBar Grid.Row="1" Name="WatchingCompletion"  Value="{Binding WatchedCompletion}" IsIndeterminate="False" Height="10" Margin="-10 0" />

                                </Grid>
                            </DataTemplate>
                        </ListBox.ItemTemplate>
                    </ListBox>

                    <StackPanel Name="UpNextStackPanel" Visibility="Collapsed">
                        <TextBlock Text="next episode(s) on the list" Margin="0 -15 0 -3"  Style="{StaticResource PhoneTextLargeStyle}"/>
                        <Border Height="2" Background="{StaticResource PhoneAccentBrush}" CacheMode="BitmapCache"/>

                        <ListBox Margin="0 5" Width="480" ScrollViewer.VerticalScrollBarVisibility="Disabled" ItemsSource="{Binding UpNextItems}" Name="UpNextList" Style="{StaticResource HorizontalListBox}" >
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <Grid Name="UpNextEpisodeGrid" Margin="0 0 8 0">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="205"/>
                                        </Grid.ColumnDefinitions>
                                        <custom:DelayLoadImage  Grid.Column="0"  DefaultImageSource="Images/screen-small.jpg" ActualImageSource="{Binding LargeScreenImage}" HorizontalAlignment="Left" Width="205" Height="145" Stretch="UniformToFill"/>
                                        <Grid Grid.Column="0" VerticalAlignment="Bottom" Width="205" Height="Auto" Background="Black" Opacity="0.7" >
                                            <TextBlock HorizontalAlignment="Center" Foreground="White" VerticalAlignment="Bottom"  Height="Auto" Width="175" TextWrapping="Wrap" Text="{Binding Name}" Style="{StaticResource PhoneTextSubtleStyle}" FontSize="18"  />
                                        </Grid>
                                        <toolkit:GestureService.GestureListener>
                                            <toolkit:GestureListener Tap="GestureListener_Tap_1" />
                                        </toolkit:GestureService.GestureListener>
                                        <toolkit:ContextMenuService.ContextMenu>
                                            <toolkit:ContextMenu Name="NextEpisodesContextMenu">
                                                <toolkit:MenuItem Header="View Episode" Name="ViewEpisode" Click="ViewEpisode_Click_1" />
                                                <toolkit:MenuItem Header="View Show" Name="ViewShow" Click="ViewShow_Click_1" />
                                                <toolkit:MenuItem Header="Check In" Name="CheckinEpisode" Click="CheckinEpisode_Click" />
                                                <toolkit:MenuItem Header="Mark as seen" Visibility="{Binding ContextMarkAsWatchedVisibility}" Name="SeenEpisode" Click="SeenEpisode_Click" />
                                                <toolkit:MenuItem Header="Unmark as seen" Visibility="{Binding ContextUnMarkAsWatchedVisibility}" Name="UnSeenEpisode" Click="UnSeenEpisode_Click" />
                                                <toolkit:MenuItem Header="Add to watchlist" Visibility="{Binding ContextWatchlist}" Name="WatchlistEpisode" Click="WatchlistEpisode_Click" />
                                                <toolkit:MenuItem Header="Remove from watchlist" Visibility="{Binding ContextUnWatchlist}" Name="RemoveWatchlistEpisode" Click="RemoveWatchlistEpisode_Click" />
                                                <toolkit:MenuItem Header="Rate" Name="EpisodeRate" Click="EpisodeRate_Click" />
                                            </toolkit:ContextMenu>
                                        </toolkit:ContextMenuService.ContextMenu>
                                    </Grid>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                    </StackPanel>
                    <StackPanel Visibility="{Binding MainVisibility}" Tap="MyShows_Click_1" Margin="0,25,0,17" Width="426" Height="Auto">
                        <TextBlock Text="My Shows" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}" Height="57" />
                        <TextBlock Text="A list of shows you are currently watching." TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}" Name="SubTextMyShows"/>
                    </StackPanel>
                    <StackPanel Visibility="{Binding MainVisibility}" Tap="MyMovies_Click_1" Margin="0,0,0,17" Width="426" Height="Auto">
                        <TextBlock Text="My Movies" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
                        <TextBlock Text="A list of movies you are currently watching." TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}" Name="SubTextMyMovies"/>
                    </StackPanel>
                </StackPanel>
            </controls:PanoramaItem>

            <controls:PanoramaItem  Margin="0 -25" x:Name="TrendingPanoramaItem" Orientation="Horizontal">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="65" />
                        <RowDefinition Height="*" />
           
                    </Grid.RowDefinitions>
                    <TextBlock Grid.Row="0" Text="Trending" FontSize="40" />
                    <ScrollViewer Grid.Row="1">
                        <StackPanel>
                        <ListBox  Margin="0 0 0 80" Name="ListTrending" ItemsSource="{Binding TrendingItems}" ScrollViewer.VerticalScrollBarVisibility="Disabled" Width="420" HorizontalAlignment="Stretch">
                            <ListBox.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <toolkit:WrapPanel />
                                </ItemsPanelTemplate>
                            </ListBox.ItemsPanel>
                            <ListBox.ItemTemplate >
                                <DataTemplate>
                                    <custom:DelayLoadImage Margin="10 0 0 10" DefaultImageSource="Images/poster-small.jpg"  ActualImageSource="{Binding TrendingImage}" Width="{Binding ImageWidth}" MaxHeight="200" Tap="TrendingImage_Tap" VerticalAlignment="Top" />
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                        <TextBlock  Text="more..." Tap="MoreTrending_Tap_1" FontSize="40" Margin="10 -70 0 30" Visibility="Collapsed" Name="MoreTrending" />
                        </StackPanel>
                    </ScrollViewer>
                </Grid>
            </controls:PanoramaItem>
            <controls:PanoramaItem Margin="0 -25" x:Name="HistoryPanoramaItem" Orientation="Horizontal">
                <Grid Name="HistoryGrid">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="52" />
                        <RowDefinition Height="55" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <TextBlock Grid.Row="0" Text="News Feed" FontSize="40" />
                    <toolkit:ListPicker Background="Transparent" BorderBrush="Transparent" ExpansionMode="FullscreenOnly" Margin="0 -20 0 0" Height="50" Foreground="{StaticResource PhoneAccentBrush}"  Name="Filter" SelectionChanged="Filter_SelectionChanged" Grid.Row="1">
                        <sys:String>All</sys:String>
                        <sys:String>My friends</sys:String>
                        <sys:String>Just me</sys:String>
                        <sys:String>-----</sys:String>
                        <sys:String>Watchlist</sys:String>
                        <sys:String>Rating</sys:String>
                        <sys:String>Checkin</sys:String>
                        <sys:String>Scrobble</sys:String>
                        <sys:String>Shout</sys:String>
                        <toolkit:ListPicker.FullModeItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal" Margin="16 21 0 20">
                                    <TextBlock Text="{Binding}"
                                       Margin="0 0 0 0"
                                       FontSize="43" 
                                       FontFamily="{StaticResource PhoneFontFamilyLight}"/>
                                </StackPanel>
                            </DataTemplate>
                        </toolkit:ListPicker.FullModeItemTemplate>
                    </toolkit:ListPicker>

                    <lazy:LazyListBox Grid.Row="2" Height="Auto" Margin="0 0 0 60" HorizontalAlignment="Left" Width="420"  ItemsSource="{Binding HistoryItems}" Name="HistoryList">
                        <lazy:LazyListBox.ItemContainerStyle>
                            <Style TargetType="ListBoxItem">
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate>
                                            <ContentPresenter
                                            HorizontalAlignment="Stretch" 
                                            VerticalAlignment="Stretch" />
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </lazy:LazyListBox.ItemContainerStyle>
                        <lazy:LazyListBox.ItemTemplate>
                            <DataTemplate>
                                <StackPanel  Height="Auto" VerticalAlignment="Stretch"  >
                                    <Grid Visibility="{Binding HeaderVisibility}" Margin="0 0 0 5" Background="{StaticResource PhoneAccentBrush}" Grid.Column="0" Grid.Row="0">
                                        <TextBlock Margin="20 5" Foreground="White" FontSize="30"  Text="{Binding Header}"/>
                                    </Grid>
                                    <Grid Margin="0 5"  Tap="Grid_Tap_1" Height="Auto" VerticalAlignment="Stretch"  Name="ActivityGrid">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="100"/>
                                            <ColumnDefinition Width="*"/>
                                        </Grid.ColumnDefinitions>
                                        <Image Opacity="0.3" Grid.Column="1" Source="Images/screen-small.jpg" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="-100 7" Height="68" MaxWidth="100" Stretch="Fill" Name="ScreenImage"  />
                                        <Grid Grid.Column="2" Height="Auto">
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="*"/>
                                            </Grid.ColumnDefinitions>
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="Auto"></RowDefinition>
                                                <RowDefinition Height="30"></RowDefinition>
                                            </Grid.RowDefinitions>
                                            <TextBlock Width="Auto" Height="Auto" Grid.Column="1" Grid.Row="0"  VerticalAlignment="Top"  HorizontalAlignment="Left"  TextWrapping="Wrap" Text="{Binding Activity}" Style="{StaticResource PhoneTextSubtleStyle}" Foreground="{StaticResource PhoneForegroundBrush}" />
                                            <TextBlock Grid.Column="1" Grid.Row="1" VerticalAlignment="Top"  HorizontalAlignment="Left" Height="Auto" TextWrapping="Wrap" Text="{Binding DateTimeString}" Style="{StaticResource PhoneTextSubtleStyle}" />
                                        </Grid>
                                        <toolkit:ContextMenuService.ContextMenu>
                                            <toolkit:ContextMenu>
                                                <toolkit:MenuItem Header="Rate" Name="HistoryRate" Click="HistoryRate_Click" />
                                            </toolkit:ContextMenu>
                                        </toolkit:ContextMenuService.ContextMenu>
                                    </Grid>
                                </StackPanel>
                            </DataTemplate>
                        </lazy:LazyListBox.ItemTemplate>
                        <lazy:LazyListBox.LoadedItemTemplate>
                            <DataTemplate>
                                <StackPanel  Height="Auto" VerticalAlignment="Stretch"  >
                                    <Grid Visibility="{Binding HeaderVisibility}" Margin="0 0 0 5" Background="{StaticResource PhoneAccentBrush}" Grid.Column="0" Grid.Row="0">
                                        <TextBlock Margin="20 5" Foreground="White" FontSize="30"  Text="{Binding Header}"/>
                                    </Grid>
                                    <Grid Margin="0 5"  Tap="Grid_Tap_1" Height="Auto" VerticalAlignment="Stretch"  Name="ActivityGrid">
                                        <Grid.Triggers>
                                            <!--Show a nice animation to fade the minimal content into the full content-->
                                            <EventTrigger RoutedEvent="Grid.Loaded">
                                                <BeginStoryboard>
                                                    <BeginStoryboard.Storyboard>
                                                        <Storyboard>
                                                            <DoubleAnimation Storyboard.TargetName="ScreenImage" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0.6">
                                                                <DoubleAnimation.EasingFunction>
                                                                    <PowerEase EasingMode="EaseIn" Power="3"/>
                                                                </DoubleAnimation.EasingFunction>
                                                            </DoubleAnimation>
                                                        </Storyboard>
                                                    </BeginStoryboard.Storyboard>
                                                </BeginStoryboard>
                                            </EventTrigger>
                                        </Grid.Triggers>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="100"/>
                                            <ColumnDefinition Width="*"/>
                                        </Grid.ColumnDefinitions>
                                        <Image Opacity="0.3" Grid.Column="1" Source="Images/screen-small.jpg" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="-100 7" Height="68" MaxWidth="100" Stretch="Fill"  />
                                        <custom:DelayLoadImage Grid.Column="1" ActualImageSource="{Binding ScreenImage}" Name="ScreenImage" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="-100 7" Height="68" MaxWidth="100" Stretch="UniformToFill"  />
                                        <Grid Grid.Column="2" Height="Auto">
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="*"/>
                                            </Grid.ColumnDefinitions>
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="Auto"></RowDefinition>
                                                <RowDefinition Height="30"></RowDefinition>
                                            </Grid.RowDefinitions>
                                            <TextBlock Width="Auto" Height="Auto" Grid.Column="1" Grid.Row="0"  VerticalAlignment="Top"  HorizontalAlignment="Left"  TextWrapping="Wrap" Text="{Binding Activity}" Style="{StaticResource PhoneTextSubtleStyle}" Foreground="{StaticResource PhoneForegroundBrush}" />
                                            <TextBlock Grid.Column="1" Grid.Row="1" VerticalAlignment="Top"  HorizontalAlignment="Left" Height="Auto" TextWrapping="Wrap" Text="{Binding DateTimeString}" Style="{StaticResource PhoneTextSubtleStyle}" />
                                        </Grid>
                                        <toolkit:ContextMenuService.ContextMenu>
                                            <toolkit:ContextMenu>
                                                <toolkit:MenuItem Header="Rate" Name="HistoryRate" Click="HistoryRate_Click" />
                                            </toolkit:ContextMenu>
                                        </toolkit:ContextMenuService.ContextMenu>
                                    </Grid>
                                </StackPanel>
                            </DataTemplate>
                        </lazy:LazyListBox.LoadedItemTemplate>
                    </lazy:LazyListBox>
                </Grid>
            </controls:PanoramaItem>
        </controls:Panorama>
    </Grid>
    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton IconUri="Images/appbar.feature.settings.rest.png" Text="Settings" Click="ApplicationBarSettingsButton_Click" />
            <shell:ApplicationBarIconButton IconUri="Images/appbar.refresh.rest.png" Text="Refresh" Click="ApplicationBarRefreshButton_Click" />
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem x:Name="CheckinHistoryMenuItem" Text="Checkin in history" Click="CheckinHistoryMenuItem_Click_1"></shell:ApplicationBarMenuItem>

                <shell:ApplicationBarMenuItem x:Name="LogoutMenuItem" Text="Logout" Click="LogoutMenuItem_Click_1"></shell:ApplicationBarMenuItem>
                <shell:ApplicationBarMenuItem x:Name="RateApp" Text="Rate and Review" Click="RateApp_Click_1"></shell:ApplicationBarMenuItem>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>
</phone:PhoneApplicationPage>